<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Favorite-web</title>
    @@include("./common/_header.html",{"filename":"product"})
</head>
<body>
    @@include("./common/_menu.html",{"class1":"","class2":"","class3":"","class4":"current","class5":""})
    <div class="content mt120">
        <div class="favorite-nav base-moblie">
            <a href="" class="hov">All products</a>
            <a href="">For You</a>
        </div>
        <div class="column">
            <div class="column-left base-pc">
                <h2 class="page-title"><a href="1">For You</a></h2>
                <ul class="list-a">
                    <li><p><span>ALL/</span><a href="">Care</a>/<a href="">Care</a></p></li>
                    <li><a href="">Lip Products</a></li>
                    <li><a href="">Eye Makeup</a></li>
                    <li><a href="">Eye Care</a></li>
                    <li><a href="">Lip Products</a></li>
                    <li><a href="">Eye Makeup</a></li>
                    <li><a href="">Eye Care</a></li>
                </ul>
                <h3 class="product-title">
                    <span class="price">PRICE</span>
                </h3>
                <div class="price-box">
                    <span>$</span>
                    <input type="text" placeholder="Min" id="min">
                    <span>to</span>
                    <input type="text" placeholder="Max" id="max">
                    <button id="price-set">set</button>
                </div>
                <h3 class="product-title">
                    <span class="brand">BRAND</span>
                </h3>
                <ul class="checkbox-list">
                    <li><p><input type="checkbox" id="check1" value="1"><label for="check1"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check2" value="2"><label for="check2"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check3" value="3"><label for="check3"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check4" value="4"><label for="check4"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check5" value="5"><label for="check5"></label></p><p>ASOS<span>97</span></p></li>
                </ul>
                <button class="search-button-slider" id="search-brand">Search all Brands</button>
                <h3 class="product-title">
                    <span class="store">STORE</span>
                </h3>
                <ul class="checkbox-list">
                    <li><p><input type="checkbox" id="check7" value="6"><label for="check7"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check8" value="7"><label for="check8"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check9" value="8"><label for="check9"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check10" value="9"><label for="check10"></label></p><p>ASOS<span>97</span></p></li>
                    <li><p><input type="checkbox" id="check11" value="10"><label for="check11"></label></p><p>ASOS<span>97</span></p></li>
                </ul>
                <button class="search-button-slider" id="search-store">Search all Store</button>
            </div>
            <div class="search-mobile base-moblie">
                <div class="search-mobile-box">
                    <div class="search-mobile-box-button">
                        <div><p>Most Favorites</p></div>
                        <em></em>
                    </div>
                    <ul class="search-mobile-box-list" style="display: none;">
                        <li><a href="">Most Favorites1</a></li>
                        <li><a href="">Most Favorites1</a></li>
                        <li><a href="">Most Favorites1</a></li>
                        <li><a href="">Most Favorites1</a></li>
                    </ul>
                </div>
                <div class="search-mobile-box">
                    <div class="search-mobile-box-button">
                        <div><p>Most Favorites</p></div>
                        <em></em>
                    </div>
                    <ul class="search-mobile-box-list" style="display: none;">
                        <li><a href="">Most Favorites1</a></li>
                        <li><a href="">Most Favorites1</a></li>
                        <li><a href="">Most Favorites1</a></li>
                        <li><a href="">Most Favorites1</a></li>
                    </ul>
                </div>
                <div class="filter">
                    Filter
                </div>
            </div>
            <div class="nav-shadow base-moblie hide">
                <div class="filter-box hide">
                    <div class="close"></div>
                    <h2>All Filter</h2>
                    <h3>
                        <a>Category</a>
                    </h3>
                    <ul class="filter-check-list">
                        <li><a href="">Brand 32.4K</a></li>
                        <li><a href="">Brand 32.4K</a></li>
                        <li><a href="">Brand 32.4K</a></li>
                        <li><a href="">Brand 32.4K</a></li>
                        <li><a href="">Brand 32.4K</a></li>
                    </ul>
                    <h3 class="hov">
                        <a>Price & Deals</a>
                        <span class="more"></span>
                    </h3>
                    <div class="filter-price-box">
                        <span>$</span>
                        <input type="text" placeholder="Min" id="filter-min">
                        <span>to</span>
                        <input type="text" placeholder="Max" id="filter-max">
                        <button id="filter-price-set">set</button>
                    </div>
                    <h3 class="hov">
                        <a>Brand</a>
                        <span class="more"></span>
                    </h3>
                    <div>
                        <ul class="filter-checkbox-list">
                            <li><p><input type="checkbox" id="acheck7" value="6"><label for="acheck7"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck8" value="7"><label for="acheck8"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck9" value="8"><label for="acheck9"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck10" value="9"><label for="acheck10"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck11" value="10"><label for="acheck11"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <button class="filter-search-button-slider" id="filter-search-brand">Search all Store</button>
                    </div>
                    <h3 class="hov">
                        <a>Store</a>
                        <span class="more"></span>
                    </h3>
                    <div>
                        <ul class="filter-checkbox-list">
                            <li><p><input type="checkbox" id="acheck7" value="6"><label for="acheck7"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck8" value="7"><label for="acheck8"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck9" value="8"><label for="acheck9"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck10" value="9"><label for="acheck10"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="acheck11" value="10"><label for="acheck11"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <button class="filter-search-button-slider" id="filter-search-store">Search all Store</button>
                    </div>
                </div>
                <div class="filter-pop-box filter-pop-box-brand hide">
                    <!-- <div class="filter-pop-box-input">
                        <input type="text" placeholder="Search for Brands">
                    </div> -->
                    <div class="filter-pop-box-option">
                        <span class="select-filter">Select All</span>
                        <span class="unselect-filter">Unselect All</span>
                    </div>
                    <div class="filter-pop-box-con">
                        <h5>123</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="concheck7" value="6"><label for="concheck7"></label></p><p>brandASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck8" value="7"><label for="concheck8"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck9" value="8"><label for="concheck9"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck10" value="9"><label for="concheck10"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck11" value="10"><label for="concheck11"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <h5>A</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="concheck71" value="6"><label for="concheck71"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck81" value="7"><label for="concheck81"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck91" value="8"><label for="concheck91"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck101" value="9"><label for="concheck101"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck111" value="10"><label for="concheck111"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <h5>B</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="concheck712" value="6"><label for="concheck712"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck812" value="7"><label for="concheck812"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck912" value="8"><label for="concheck912"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck1012" value="9"><label for="concheck1012"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck1112" value="10"><label for="concheck1112"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <h5>C</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="concheck713" value="6"><label for="concheck713"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck813" value="7"><label for="concheck813"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck913" value="8"><label for="concheck913"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck1013" value="9"><label for="concheck1013"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="concheck1113" value="10"><label for="concheck1113"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                    </div>
                    <div class="filter-pop-box-submit">
                        <span class="apply-pop">Apply</span>
                        <span class="cancel-pop">Cancel</span>
                    </div>
                </div>
                <div class="filter-pop-box filter-pop-box-store hide">
                    <!-- <div class="filter-pop-box-input">
                        <input type="text" placeholder="Search for Brands">
                    </div> -->
                    <div class="filter-pop-box-option">
                        <span class="select-filter">Select All</span>
                        <span class="unselect-filter">Unselect All</span>
                    </div>
                    <div class="filter-pop-box-con">
                        <h5>123</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="cconcheck7" value="6"><label for="cconcheck7"></label></p><p>storeASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck8" value="7"><label for="cconcheck8"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck9" value="8"><label for="cconcheck9"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck10" value="9"><label for="cconcheck10"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck11" value="10"><label for="cconcheck11"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <h5>A</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="cconcheck71" value="6"><label for="cconcheck71"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck81" value="7"><label for="cconcheck81"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck91" value="8"><label for="cconcheck91"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck101" value="9"><label for="cconcheck101"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck111" value="10"><label for="cconcheck111"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <h5>B</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="cconcheck712" value="6"><label for="cconcheck712"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck812" value="7"><label for="cconcheck812"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck912" value="8"><label for="cconcheck912"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck1012" value="9"><label for="cconcheck1012"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck1112" value="10"><label for="cconcheck1112"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                        <h5>C</h5>
                        <ul class="filter-pop-checkbox-list">
                            <li><p><input type="checkbox" id="cconcheck713" value="6"><label for="cconcheck713"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck813" value="7"><label for="cconcheck813"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck913" value="8"><label for="cconcheck913"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck1013" value="9"><label for="cconcheck1013"></label></p><p>ASOS<span>97</span></p></li>
                            <li><p><input type="checkbox" id="cconcheck1113" value="10"><label for="cconcheck1113"></label></p><p>ASOS<span>97</span></p></li>
                        </ul>
                    </div>
                    <div class="filter-pop-box-submit">
                        <span class="apply-pop">Apply</span>
                        <span class="cancel-pop">Cancel</span>
                    </div>
                </div>
            </div>
            <div class="column-right">
                <div class="base-pc">
                    @@include("./common/_search.html")
                </div>
                <div class="products-content infinite-scroll">
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                    @@include("./common/_productBox.html")
                </div>
                <div class="base-pc">
                    @@include("./common/_page.html")
                </div>
                <div class="recommend-more base-moblie"><a></a></div>
            </div>
        </div>
        @@include("./common/_footer.html")
    </div>
    @@include("./common/_lastFooter7.html",{"filename":"product"})
</body>
</html>